<template>
    <van-nav-bar left-arrow @click-left="onClickLeft" />
    <div class="image-wrapper">
        <img style="width: 100%;" :src="xjsj?.img_url" alt="">
        <div class="text-box">ONE</div>
    </div>
    <div style="position: relative;">

        <div style="position: absolute; top: 10px; left: 10px;">
            <p style="color: #9f9f9f; font-size: 12px;">{{xjsj?.input_date.split(' ')[0]}}</p>
        </div>
        <div class="fhzxmwb">{{ xjsj?.content }}</div>
    </div>
</template>

<script setup>
const { onMounted, ref } = require("@vue/runtime-core");
const onClickLeft = () => history.back();
const xjsj = ref()
onMounted(() => {
    xjsj.value = JSON.parse(localStorage.getItem('xiaojiitem'))
    console.log(xjsj);
})
</script>

<style lang="less" scoped>
.image-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
}

.text-box {
    position: absolute;
    bottom: 10px;
    right: 10px;
    // background-color: rgba(0, 0, 0, 0.7);
    color: #acacac;
    padding: 5px 10px;
    font-size: 14px;
}
.fhzxmwb{
    box-sizing: border-box;
    padding: 70px 10px;
}
</style>